<template>
  <div
    style="background:#fff;display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;color:#666"
  >
    <div style="width:100%">
      <span
        style="    font-size: 20px;
    margin: 30px 40px;
    display: inline-block;
      color:#000
"
      >
        <i class="el-icon-document"></i>个人信息
      </span>
      <el-button
        @click="goback()"
        size="mini"
        round
        style="margin-left: 1000px;"
        type="primary"
        >返回</el-button
      >
      <el-row :gutter="20">
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>用户头像：</span>
            <span>
              <img
                :src="this.memderdetailinfo.headPicUrl"
                style="width:100px;height:100px"
              />
            </span>
          </div>
        </el-col>

        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>会员编号：</span>
            <span>{{ this.memderdetailinfo.memberSeq }}</span>
          </div>
        </el-col>
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>会员昵称：</span>
            <span>{{ this.memderdetailinfo.nickName }}</span>
          </div>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>手机号码：</span>
            <span>{{ this.memderdetailinfo.cellPhoneNo }}</span>
          </div>
        </el-col>
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>性别：</span>
            <span v-if="this.memderdetailinfo.sex == 0"></span>
            <span v-if="this.memderdetailinfo.sex == 1">男</span>
            <span v-if="this.memderdetailinfo.sex == 2">女</span>
          </div>
        </el-col>
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>生日：</span>
            <span>{{ this.memderdetailinfo.birthday }}</span>
          </div>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>创建时间：</span>
            <span>{{ this.memderdetailinfo.createTime }}</span>
          </div>
        </el-col>
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>绑定关系：</span>
            <span v-if="this.memderdetailinfo.bindStatus == 1">{{
              '强绑定'
            }}</span>
            <span v-if="this.memderdetailinfo.bindStatus == 2">{{
              '弱绑定'
            }}</span>
            <span v-if="this.memderdetailinfo.bindStatus == 3">{{
              '已流失'
            }}</span>
          </div>
        </el-col>
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>注册来源：</span>

            <span v-if="this.memderdetailinfo.memberType == 1">{{
              '自主注册'
            }}</span>
            <span v-if="this.memderdetailinfo.memberType == 2">{{
              '产品分享注册'
            }}</span>
            <span v-if="this.memderdetailinfo.memberType == 3">{{
              '活动分享注册'
            }}</span>
            <span v-if="this.memderdetailinfo.memberType == 4">{{
              '店铺分享注册'
            }}</span>
            <span v-if="this.memderdetailinfo.memberType == 5">{{
              '分享有礼'
            }}</span>
            <span v-if="this.memderdetailinfo.memberType == 6">{{
              '注册有礼'
            }}</span>
          </div>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <!-- <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>用户头像：</span>
            <span>
              <img :src="this.memderdetailinfo.headPicUrl" style="width:100px;height:100px" />
            </span>
          </div>
        </el-col> -->
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>联系地址：</span>
            <span>{{ this.memderdetailinfo.postAddress }}</span>
          </div>
        </el-col>
      </el-row>
    </div>
    <div style="width:100%">
      <span
        style="    font-size: 20px;
    margin: 30px 40px;
    display: inline-block;
      color:#000
"
      >
        <i class="el-icon-document"></i>基础信息
      </span>
      <el-row :gutter="20">
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>所属大区：</span>
            <span>{{ this.memderdetailinfo.upOrgSeqName }}</span>
          </div>
        </el-col>
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>所属营销区域：</span>
            <span>{{ this.memderdetailinfo.baseName }}</span>
          </div>
        </el-col>
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>所属专卖店：</span>
            <span>{{ this.memderdetailinfo.storeName }}</span>
          </div>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>会员积分：</span>
            <span>{{ this.memderdetailinfo.currentScore }}</span>
          </div>
        </el-col>
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>会员等级：</span>
            <span>{{ this.memderdetailinfo.gradeLevel }}</span>
          </div>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>状态：</span>
            <span>{{
              this.memderdetailinfo.status == 1 ? '启用' : '停用'
            }}</span>
          </div>
        </el-col>
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>备注：</span>
            <span>{{ this.memderdetailinfo.remarkName }}</span>
          </div>
        </el-col>
      </el-row>
    </div>
    <div style="width:100%">
      <span
        style="    font-size: 20px;
    margin: 30px 40px;
    display: inline-block;
      color:#000
"
      >
        <i class="el-icon-document"></i>资质信息
      </span>
      <el-row :gutter="20">
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span style="font-weight:900">个人用户</span>
          </div>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>姓名：</span>
            <!-- <span>{{this.memderdetailinfo.upOrgSeqName}}</span> -->
          </div>
        </el-col>
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>身份证号码：</span>
            <!-- <span>{{this.memderdetailinfo.storeName}}</span> -->
          </div>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>身份证图片（正面）：</span>
            <!-- <span>{{this.memderdetailinfo.currentScore}}</span> -->
          </div>
        </el-col>
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>身份证图片（反面）：</span>
            <!-- <span>{{this.memderdetailinfo.gradeLevel}}</span> -->
          </div>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span style="font-weight:900">企业用户</span>
          </div>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>企业名称：</span>
            <!-- <span>{{this.memderdetailinfo.status==1?"启用":"停用"}}</span> -->
          </div>
        </el-col>
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>营业执照号码：</span>
            <!-- <span>{{this.memderdetailinfo.remarkName}}</span> -->
          </div>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="6" :push="1">
          <div class="grid-content bg-purple">
            <span>营业执照图片：</span>
            <!-- <span>{{this.memderdetailinfo.status==1?"启用":"停用"}}</span> -->
          </div>
        </el-col>
      </el-row>
    </div>
    <!-- <div style="width:100%">
      <span
        style="    font-size: 20px;
    margin: 30px 40px;
    display: inline-block;
      color:#000
"
      >
        <i class="el-icon-document"></i>用户订单
      </span>
    <el-table
      :data="tableData"
      style="width: 100%"
      border
      :header-cell-style="{background:'#eef1f6',color:'#606266'}"
    >
      <el-table-column prop="orderNo" label="订单编号" width="180"></el-table-column>
      <el-table-column prop="goodsName" label="商品名称" width="180">
        <template slot-scope="{row}">
          <div>
            <p v-for="(goodsName, index) in row.items" :key="index">{{goodsName.goodsName}}</p>
          </div>
        </template>
      </el-table-column>
      <el-table-column prop="receivedMoney" label="订单实付金额"></el-table-column>
      <el-table-column prop="createTime" label="下单时间"></el-table-column>
      <el-table-column prop="authCode" label="专卖店编号"></el-table-column>
      <el-table-column prop="storeName" label="专卖店名称"></el-table-column>
      <el-table-column prop="orderStatus" label="订单状态">
        <template slot-scope="scope">
          <span v-if="scope.row.orderStatus==0">待支付</span>
          <span v-if="scope.row.orderStatus==1">待发货</span>
          <span v-if="scope.row.orderStatus==2">待收货</span>
          <span v-if="scope.row.orderStatus==3">已完成</span>
          <span v-if="scope.row.orderStatus==4">已取消</span>
        </template>
      </el-table-column> -->
    <!-- <el-table-column prop="returnStatus" label="订单状态">
        <template slot-scope="scope">
          <span v-if="scope.row.returnStatus==0">正常单</span>
          <span v-if="scope.row.returnStatus==1">被退货单</span>
          <span v-if="scope.row.returnStatus==2">退货单</span>
        </template>
      </el-table-column> -->
    <!-- </el-table>
    </div> -->
  </div>
</template>

<script>
import { getTradeOrderInfo, queryMemberDetail } from '@/api/memberinfodetail';
import qs from 'qs';
export default {
  data() {
    return {
      memderdetailinfo: {},
      tableData: [],
    };
  },
  mounted() {
    this._queryMemberDetail();
    console.log(this.$route.params.v, 'gg');
    this._getTradeOrderInfo();
  },
  methods: {
    goback() {
      //   this.$router.push("/headexamine");
      this.$router.go('-1');
    },
    _getTradeOrderInfo() {
      let data = {
        size: '10',
        current: '1',
        condition: {
          memberId: this.$route.params.v.memberId,
        },
        ascs: [],
        descs: [],
      };

      getTradeOrderInfo(data).then((res) => {
        this.tableData = res.records;
      });
    },
    _queryMemberDetail() {
      let data = { memberId: this.$route.params.v.memberId };

      queryMemberDetail(data).then((res) => {
        this.memderdetailinfo = res.result;
        console.log(this.memderdetailinfo, '9990');
      });
    },
  },
};
</script>
<style lang="less" scoped>
.el-row {
  margin-bottom: 40px;
  &:last-child {
    margin-bottom: 0;
  }
}
.el-col {
  border-radius: 4px;
}
.bg-purple-dark {
  //   background: #99a9bf;
}
.bg-purple {
  //   background: #d3dce6;
}
.bg-purple-light {
  //   background: #e5e9f2;
}
.grid-content {
  border-radius: 4px;
  min-height: 36px;
}
.row-bg {
  padding: 10px 0;
  //   background-color: #f9fafc;
}
</style>
